<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<link rel="stylesheet" href="index.css">
		<title>Vue 计算器</title>
	</head>

	<body>
		<div id="calculator">
			<!-- 显示框 -->
			<input-box v-bind:input-show="inputShow">

			</input-box>
			<btn-list>
				<div v-on:click="operator('clear')" class=" btn-30 btn-radius color-red clear-marginleft">C</div>
				<div v-on:click="operator('opposite')" class=" btn-30 btn-radius color-blue">+/-</div>
				<div v-on:click="operator('percent')" class=" btn-30 btn-radius color-blue">%</div>
				<div v-on:click="operator('backspace')" class=" btn-70 btn-radius color-red font-14">←</div>
				<div v-on:click="typetoinput('7')" class=" btn-30 btn-radius clear-marginleft">7</div>
				<div v-on:click="typetoinput('8')" class=" btn-30 btn-radius">8</div>
				<div v-on:click="typetoinput('9')" class=" btn-30 btn-radius">9</div>
				<div v-on:click="operator('plus')" class=" btn-30 btn-radius color-blue font-14">+</div>
				<div v-on:click="operator('minus')" class=" btn-30 btn-radius color-blue font-14">-</div>
				<div v-on:click="typetoinput('4')" class=" btn-30 btn-radius clear-marginleft">4</div>
				<div v-on:click="typetoinput('5')" class=" btn-30 btn-radius">5</div>
				<div v-on:click="typetoinput('6')" class=" btn-30 btn-radius">6</div>
				<div v-on:click="operator('multiply')" class=" btn-30 btn-radius color-blue font-14">×</div>
				<div v-on:click="operator('divide')" class=" btn-30 btn-radius color-blue font-12">÷</div>
				<div v-on:click="typetoinput('1')" class=" btn-30 btn-radius clear-marginleft">1</div>
				<div v-on:click="typetoinput('2')" class=" btn-30 btn-radius">2</div>
				<div v-on:click="typetoinput('3')" class=" btn-30 btn-radius">3</div>
				<div v-on:click="operator('pow')" class=" btn-30 btn-radius color-blue font-14">×²</div>
				<div v-on:click="operator('sqrt')" class=" btn-30 btn-radius color-blue font-12">√</div>
				<div v-on:click="typetoinput('0')" class=" btn-70 btn-radius clear-marginleft">0</div>
				<div v-on:click="typetoinput('.')" class=" btn-30 btn-radius">.</div>
				<div v-on:click="operator('result')" class=" btn-70 btn-radius color-red font-14">=</div>
			</btn-list>

		</div>

		<script src="../vue.js" charset="utf-8"></script>
		<script src="calculator.js" charset="utf-8"></script>
	</body>

</html>